<template>
  <view class="whe_maxv ba_yy">
    <view class="wh_f pad_t-10">
      <view class="boxs" style="padding:0 20px">
        <view class="fz_18 em">{{ kill.name }}</view>
        <view v-if="kill.is_doing == 1">
          <view class="fz_12 pad_5_0">距开始</view>
           <up-count-down
               :time="kill.start_seconds * 1000"
               format="HH:mm:ss">
           </up-count-down>
        </view>
        <view v-if="kill.is_doing == 2">
          <view class="fz_12 pad_5_0">距结束</view>
           <up-count-down
               :time="kill.last_seconds * 1000"
               format="HH:mm:ss">
           </up-count-down>
        </view>
        <view v-if="kill.is_doing == 3">
          <view class="fz_12 pad_5_0">已结束</view>
          <view class="">本场已结束</view>
        </view>
      </view>
      <view class="flex_1 wz_jz ccgl-y bhh pad_0_10">
        <view class="disp" v-for="(item,index) in topList" :key="index"
              :class="status === item.id?'xzqg':''" @click="addBT(item,index)">
          <view class="bt bor_10" style="padding:10px 20px">
            <view class="fz_14">{{ item.start_month_data }}</view>
            <view class="fz_16 mag_t-5">{{ item.start_hours }}</view>
            <view class="fz_12" style="padding: 2px 0 6px">
              <span v-if="item.is_doing == 1">即将开始</span>
              <span v-if="item.is_doing == 2">抢购中</span>
              <span v-if="item.is_doing == 3">已结束</span>
            </view>
          </view>

          <!--        <view v-if="status === item.id" class="bor_5 jz" style="width: 20px;height: 5px;background-color: #3a9e5f"></view>-->
        </view>
      </view>

    </view>

    <view v-if="list" class="pad_0_15">
      <view v-for="(item,index) in list" :key="index" class="xyy wh_f_r ba_white bor_10 mag_t-15">
        <view style="width: 100px;padding: 10px">
          <view class="img_zfx">
            <img :src="item.goods_info.image[0]" alt="">
          </view>
        </view>
        <view style="padding: 10px 10px 10px 0">
          <view class="pad_5_0">
            <view class="ccsl_1 fz_18">{{item.goods_info.name}}</view>
          </view>
          <view class="wh_f_l">
            <view class="czjz_flex">
              <up-line-progress activeColor="#f82251" inactiveColor="#ffdfde" :percentage="(item.last_stock/item.stock)*100"
                                height="14" :showText="false"></up-line-progress>
            </view>
            <view class="wz_jz fz_12 pad_0_10" style="color: #ff1a5b">已抢
              {{ (100 - (item.last_stock/item.stock * 100)).toFixed(2) }}%
            </view>
          </view>
          <view>
            <text v-if="item.delivery_type == 1" class="bor_25 fz_12" style="background-color: #ffe6ec;color: #f82251;padding: 1px 12px">
              自提
            </text>
            <text v-if="item.delivery_type == 2" class="bor_25 fz_12" style="background-color: #ffe6ec;color: #f82251;padding: 1px 12px">
              配送到家
            </text>
          </view>
          <view class="wh_f_l mag_t-5">
            <view>
              <view class="scx wz_hui fz_12">¥ {{item.goods_info.price}}</view>
              <view class="wz_red">
                <text class="bottomdq">¥ </text>
                <text class="fz_18 bottomdq em">{{item.goods_info.discount_price}}</text>
              </view>
            </view>
            <view class="jz_flex fz_14">
              <text v-if="kill.is_doing == 2" @click="killshop(item)" class="bor_10 ba_white"
                    style="background-color: #ff3628;color: white;padding: 6px 15px">马上抢</text>
              <text v-if="kill.is_doing == 1" class="bor_10 ba_white"
                    style="background-color: #3a9e5f;color: white;padding: 6px 15px">暂未开始</text>
              <text v-if="kill.is_doing == 3" class="bor_10 ba_white"
                    style="background-color: #a4a4a6;color: white;padding: 6px 15px">活动已结束</text>
            </view>
          </view>
        </view>
      </view>
      <view style="height: 30px"></view>
    </view>
  </view>
</template>
<script>
import {aggoodsList, doRefund, doSeckill, goodsListInfo, goodsListNew, receiveDefault} from "../../Api/shop";
import ActList from "../../pagesList/ActList/index.vue";
import Login from "../../user/login/index.vue";

export default {
  name: "index",
  computed: {
    ActList() {
      return ActList
    }
  },
  data(){
    return{
      status:1,
      list:[],
      AactList:[],
      delivery_type:null,
      topList:[],
      kill: {},
    }
  },
  methods:{
    killshop(e){
      let tthis = this
      console.log('抢购的商品',e)
      let jwd =  uni.getStorageSync('latAddress');
      let item = uni.getStorageSync('dak');
      // 1自提 2配送
      if(e.delivery_type === 1){
        console.log("驿站数据",item)
        if(jwd){
          if(!item){
            uni.showModal({
              title: '提示',
              content: '自提订单需要选择驿站,是否前往?',
              success: function (res) {
                if (res.confirm) {
                  uni.navigateTo({
                    url: `/porder/orderList/index`
                  });
                }
              }
            });
          }else{
            doSeckill({
              id:e.id,
              stage_store_id:item.id
            }).then(res=>{
              let orderNo = res.data.orderNo
              this.getList(this.kill.id)
              if(res.success){
                setTimeout(()=>{
                  uni.showModal({
                    title: '提示',
                    content: '抢购成功,请尽快付款',
                    success: function (res) {
                      if (res.confirm) {
                        uni.navigateTo({
                          url: `/porder/orderDetail/index?orderNo=${orderNo}`
                          // url: `/porder/orderList/index`
                        });
                      }
                    }
                  });
                },1000)

              }
              console.log("抢购结果",res)
            })
          }
        }else{
          tthis.getAddress()
        }
      }else{
        //配送到家
        receiveDefault().then(res=>{
          if(res.data){
            doSeckill({
              id:e.id,
              address_id:res.data.id
            }).then(res=>{
              console.log("抢购结果",res)
              let orderNo = res.data.orderNo
              this.getList(this.kill.id)

              if(res.success){
                setTimeout(()=>{
                  uni.showModal({
                    title: '提示',
                    content: '抢购成功,请尽快付款',
                    success: function (res) {
                      if (res.confirm) {
                        uni.navigateTo({
                          url: `/porder/orderDetail/index?orderNo=${orderNo}`
                          // url: `/porder/orderList/index`
                        });
                      }
                    }
                  });
                },1000)

              }
            })
          }
        })
      }
    },
    //获取用户授权
    getAddress(){
      var that = this
      wx.authorize({
        scope: 'scope.userLocation',//发起定位授权
        success: function () {
          wx.getLocation({
            type: 'wgs84',
            success(res) {
              const latitude = res.latitude
              const longitude = res.longitude
              const speed = res.speed
              const accuracy = res.accuracy
              let latAddress = JSON.stringify({
                latitude : res.latitude,
                longitude : res.longitude,
                speed : res.speed,
                accuracy : res.accuracy
              })
              uni.setStorageSync('latAddress',latAddress);
              console.log(latAddress)
              if(!item){
                uni.showModal({
                title: '提示',
                content: '自提订单需要选择驿站,是否前往?',
                success: function (res) {
                  if (res.confirm) {
                    uni.navigateTo({
                      url: '/pagesList/dakList/index'
                    });
                  }
                }
              });
              }


            }
          })
          //授权成功，此处调用获取定位函数
        }, fail() {
          //如果用户拒绝授权，则要告诉用户不授权就不能使用，引导用户前往设置页面。
          wx.showModal({
            cancelColor: 'cancelColor',
            title: '没有授权无法获取位置信息',
            content: '是否前往设置页面手动开启',
            success: function (res) {
              if (res.confirm) {
                wx.openSetting({
                  withSubscriptions: true,
                })
              } else {
                wx.showToast({
                  icon: 'none',
                  title: '您取消了定位授权',
                })
              }
            }, fail: function (e) {
              console.log(e)
            }
          })
        }
      })

    },
    addBT(e,i){
      console.log(888,e)
      this.status = e.id
      this.kill = e
      this.getList(e.id)
    },
    getList(e){
      console.log(777,e)
      goodsListInfo({id:e}).then(res=>{
        this.list = res.data
        console.log(123,res)
        // this.AactList = res.data?.actsList
        console.log("抢购列表",this.AactList)
        // this.list = res.data?.actsList[0].goods_list
        // console.log("抢购列表2",this.list)
        // this.status = res.data.actsList[0].act_info.id
      })
    }
  },
  onShow(){
    goodsListNew().then(res=>{
      this.topList = res.data
      this.kill = res.data[0]
      this.status = res.data[0].id
      this.getList(res.data[0].id)
      console.log('新接口',res)
    })
    // aggoodsList().then(res=>{
    //   this.AactList = res.data?.actsList
    //   console.log("抢购列表",this.AactList)
    //   this.list = res.data?.actsList[0].goods_list
    //   console.log("抢购列表2",this.list)
    //   this.status = res.data.actsList[0].act_info.id
    // })
  }
}
</script>
<style scoped lang="scss">
::v-deep.u-count-down__text{
  color: #ff3628!important;
}
.xzqg{
  .bt{
    background-color: #2c2c2c;
    color: white;
  }
}
.ba_yy{
  background: linear-gradient(#fcd60e, #eaced2);

  width: 100vw;
  height: 100vh;
}
</style>
